<!--
 * @Author: hu_binbin
 * @Date: 2021-08-25 11:13:58
 * @LastEditTime: 2021-08-25 15:52:10
 * @Description: 缺陷审核
-->
<template>
	<article class="bg_4dbfae">
		<Theader :title="title">
			<template slot="header_arrow">
				<van-icon size="25" name="arrow-left" @click="$pageBack"/>
			</template>
		</Theader>
        <div style="overflow-y: auto;height: 100%;padding-bottom: 5rem;">
            <!-- 基本信息-->
            <div class="tab-item">
                <div class="lable-list">
                    <van-field 
                        label="变电站:"  
                        readonly 
                        :border="false"
                        v-model="taskDetail.substationName"
                    />
                    <van-field 
                        label="缺陷设备:" 
                        readonly 
                        :border="false"
                        v-model="taskDetail.voltageLevel" 
                    />
                    <van-field 
                        label="设备型号:" 
                        readonly 
                        :border="false" 
                        v-model="taskDetail.patrolTypeName" 
                    />
                    <van-field 
                        label="生产厂家:" 
                        readonly 
                        :border="false"
                        v-model="taskDetail.voltageLevel" 
                    />
                    <van-field 
                        label="投运日期:" 
                        readonly 
                        :border="false" 
                        v-model="taskDetail.patrolTypeName" 
                    />
                    <van-field 
                        label="设备类型:" 
                        readonly 
                        :border="false" 
                        v-model="taskDetail.patrolTypeName" 
                    />
                    <van-field 
                        label="实物ID:" 
                        readonly 
                        :border="false" 
                        v-model="taskDetail.patrolTypeName" 
                    />
                    <van-field 
                        label="作业卡类型:" 
                        readonly 
                        :border="false" 
                        v-model="taskDetail.patrolTypeName" 
                    />
                    <div>
                        <van-row class="defe-des">作业内容:</van-row>
                        <div style="margin: 15px;border-radius: 5px;">
                            <van-field class="textarea-content" disable v-model.trim="taskDetail.remark" rows="2" autosize type="textarea"
                                placeholder="请输入">
                            </van-field>
                        </div>
                    </div>
                    <van-field 
                        label="设备种类:" 
                        readonly 
                        :border="false" 
                        v-model="taskDetail.patrolTypeName" 
                    />
                    <van-field 
                        label="缺陷部件:" 
                        readonly 
                        :border="false" 
                        v-model="taskDetail.patrolTypeName" 
                    />
                    <van-field 
                        label="部件种类:" 
                        readonly 
                        :border="false" 
                        v-model="taskDetail.patrolTypeName" 
                    />
                    <van-field 
                        label="缺陷部位:" 
                        readonly 
                        :border="false" 
                        v-model="taskDetail.patrolTypeName" 
                    />
                    <div>
                        <van-row class="defe-des">缺陷描述:</van-row>
                        <div style="margin: 15px;border-radius: 5px;">
                            <van-field class="textarea-content" disable v-model.trim="taskDetail.remark" rows="2" autosize type="textarea"
                                placeholder="请输入">
                            </van-field>
                        </div>
                    </div>
                    <van-field 
                        label="缺陷性质:" 
                        readonly 
                        :border="false" 
                        v-model="taskDetail.patrolTypeName" 
                    />
                    <van-field 
                        label="分类依据:" 
                        readonly 
                        rows="2"
                        autosize
                        type="textarea"
                        :border="false" 
                        v-model="taskDetail.patrolTypeName" 
                    />
                    <div>
                        <van-row class="defe-des">缺陷内容:</van-row>
                        <div style="margin: 15px;border-radius: 5px;">
                            <van-field class="textarea-content" disable v-model.trim="taskDetail.remark" rows="2" autosize type="textarea"
                                placeholder="请输入">
                            </van-field>
                        </div>
                    </div>
                    <div>
                        <van-row class="defe-des">备注:</van-row>
                        <div style="margin: 15px;border-radius: 5px;">
                            <van-field class="textarea-content" disable v-model.trim="taskDetail.remark" rows="2" autosize type="textarea"
                                placeholder="请输入">
                            </van-field>
                        </div>
                    </div>
                    
                    <div class="p-img">
                        <van-row style="margin: 1rem 0;" class="defe-des">照片:</van-row>
                        <div class="imgSize">
                            <van-image  width="47" height="47" :src="icon.iconTitle" /> 
                            <van-image  width="47" height="47" :src="icon.iconTitle" /> 
                            <van-image  width="47" height="47" :src="icon.iconTitle" />  
                        </div>
                    </div>
                    <div class="p-img">
                        <van-row style="margin: 1rem 0;" class="defe-des">视频:</van-row>
                        <div class="imgSize">
                            <van-image  width="47" height="47" :src="icon.iconTitle" /> 
                            <van-image  width="47" height="47" :src="icon.iconTitle" /> 
                            <van-image  width="47" height="47" :src="icon.iconTitle" />  
                        </div>
                    </div>
                    <div class="p-img">
                        <van-row style="margin: 1rem 0;" class="defe-des">录音:</van-row>
                        <div class="imgSize">
                            <van-button color="#17B49B" style="width: 60%;" icon="bullhorn-o" size="mini" type="primary">65＂</van-button>
                        </div>
                    </div>
                    <div class="border-b"></div>
                    <div>
                        <van-field 
                            label="关联任务:" 
                            readonly 
                            :border="false" 
                            v-model="taskDetail.patrolTypeName" 
                        />
                        <van-field 
                            label="发现方式:" 
                            readonly 
                            :border="false" 
                            v-model="taskDetail.patrolTypeName" 
                        />
                        <van-field 
                            label="发现人:" 
                            readonly 
                            :border="false" 
                            v-model="taskDetail.patrolTypeName" 
                        />
                        <van-field 
                            label="发现日期:" 
                            readonly 
                            :border="false" 
                            v-model="taskDetail.patrolTypeName" 
                        />
                        <van-field 
                            label="发现班组:" 
                            readonly 
                            :border="false" 
                            v-model="taskDetail.patrolTypeName" 
                        />
                        <van-field 
                            label="发现人单位:" 
                            readonly 
                            :border="false" 
                            v-model="taskDetail.patrolTypeName" 
                        />
                        <van-field 
                            label="登记人:" 
                            readonly 
                            :border="false" 
                            v-model="taskDetail.patrolTypeName" 
                        />
                        <van-field 
                            label="登记时间:" 
                            readonly 
                            :border="false" 
                            v-model="taskDetail.patrolTypeName" 
                        />
                        <van-field style="border-radius: 0.7rem;"
                            label="已消缺:" 
                            readonly 
                            :border="false" 
                            v-model="taskDetail.patrolTypeName" 
                        />
                        <van-cell class="selRadio" :border="false" title="已消缺:">
                            <template slot="default">
                                <van-radio-group v-model="radio" direction="horizontal">
                                    <van-radio checked-color="#17B39B" name="1">是</van-radio>
                                    <van-radio checked-color="#17B39B" name="2">否</van-radio>
                                </van-radio-group>
                            </template>
                        </van-cell>
                        <van-cell title="跟踪记录" :border="false" is-link @click="toPageRecord"></van-cell>
                        <div>
                            <van-row class="defe-des">审核意见:</van-row>
                            <div style="margin: 15px;border-radius: 5px;">
                                <van-field class="textarea-content" disable v-model.trim="taskDetail.remark" rows="2" autosize type="textarea"
                                    placeholder="请输入审核意见">
                                    <template slot="right-icon">
                                        <van-image :src="icon.iconAudio" width="24" height="24"></van-image>
                                    </template>
                                </van-field>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- <div class="tab-record">
                <van-cell style="border-radius: 0.7rem;" @click="toPageRecord" title="跟踪记录" is-link></van-cell>
            </div> -->
            <!--底部按钮-->
            <div class="btn">
                <div class="btn-left">
                    <van-image :src="icon.iconBack" width="24" height="24"></van-image>
                    <div>退回</div>
                </div>
                <div class="btn-right">
                    <van-image :src="icon.iconEnd" width="24" height="24"></van-image>
                    <div>结束</div>
                </div>
                <van-button color="#17B39B" style="width: 55%;height: 3rem;" size="small" type="primary">提交审核</van-button>
            </div>
        </div>
	</article>
</template>
<script>
	import Theader from "../component/header"
	export default {
		name: "auditDefect",
		components:{
			Theader
		},
		data() {
			return {
                active: 0,
                title: "班组审核",
                taskDetail: {
                    substationName:"东善桥变",
                    voltageLevel:"500Kv",
                    patrolTypeName:"全面巡视",
                    cycleTime:"2月",
                    fristTime:"2021/07/07 18:30:00",
                    team:"变电运维一班",
                    tourWay:"人工巡视",
                    planTime:"2021/07/07 18:30:00",
                    nextTime:"2021/07/07 18:30:00",
                    require:"的撒啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊",
                },
                icon: {
                    iconTitle: require("../../../../assets/tour/icon-title.png"),
                    rfid: require("../../../../assets/tour/icon-rfid.png"),
                    scan:require('../../../../assets/tour/icon-scan.png'),
                    iconBack:require('../../../../assets/tour/icon_back.png'),
                    iconEnd:require('../../../../assets/tour/icon-end.png'),
                    iconAudio:require('../../../../assets/tour/audio.png'),
                },
                activeNames: ['1'],
                radio:1,
			}
		},
		computed: {

		},
		methods: {
            //rifid 
            rfidBtn() {

            },
            //扫描二维码
            scanBtn() {

            },
            /**
             * @description: 跟踪记录
             * @param {*}
             * @return {*}
             */
            toPageRecord() {
                this.$router.push({
                    name: "trackRecord"
                })
            }
		},
		watch: {
			
		},
		mounted() {

		}
	}
</script>
<style scoped>
	article {
		display: flex;
		flex-direction: column;
		height: 100vh;
	}
	.bg_4dbfae{
		background: #F0F0F0 ;
    }

    .tab-item{
        font-size: 0.875rem;
        margin: 0.7rem;
        margin-top: 3.7rem;
        background: #fff;
        border-radius: 0.7rem;
        border:1px solid #51C8B3;
    }
    .tab-record{
        font-size: 0.875rem;
        margin: 0.7rem;
        background: #fff;
        border-radius: 0.7rem;
        border:1px solid #51C8B3;
    }
    .tab-item /deep/ .van-field__label{
        width: 7rem;
    }
    .tab-item /deep/ .van-field__control{
        color:#999;
        text-align: right;
    }
    .tab-item .lable-list{
        margin-top: 0.5rem;
    }
    .textarea-content{
        color:#333;
        font-size:0.875rem;
		border: 1px solid #E2E2E2;color:#999;
        padding-bottom: 1.5rem;
    }
    .textarea-content /deep/ .van-field__right-icon{
        position: absolute;
        bottom: -0.2rem;
        right: 0.5rem;
    }
    .p-img{
        margin: 0 1rem;
    }
    .defe-des{
        color:#666;
        margin: 0.6rem 1rem;
        font-size:0.875rem;
    }
    .textarea-content /deep/ .van-field__control{
        text-align: left;
    }
    .imgSize{
        display: flex; 
        justify-content: space-between;
    }
    .selRadio /deep/ .van-cell__title{
        width: 80px;
        flex: inherit;
    }
    /deep/ .van-radio-group--horizontal{
        justify-content:flex-end;
    }
    .border-b{
        border-bottom: 1px solid #E5E5E5;
        margin-top: 1.5rem;
        margin-bottom: 1rem;
    }
    .btn{
        width: 100%;
        background: rgb(255, 255, 255);
        padding: 1rem 0px;
        position: fixed;
        bottom: 0;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }
    .btn .btn-left, .btn .btn-right{
        text-align: center;
        font-size: 0.94rem;
        width: 15%;
    }
    
</style>
